<script lang="ts" setup>
import { UploadProps } from "@/components/inputs/inputtype"
import { ElMessage } from 'element-plus'
const fileList = defineModel()
const props = defineProps<UploadProps>()

const emit = defineEmits<{
    "change":[fileList:any]
}>()

const handlesuccess = function(response: any, uploadFile: any){
    console.log(response)
    ElMessage({
        message: '上传（'+uploadFile.name+'）成功！',
        type: 'success',
    });
    emit('change',fileList);
}

const handleremove =function(uploadFile: any){
    ElMessage({
        message: '移除（'+uploadFile.name+'）成功！',
        type: 'info',
    });
    emit('change',fileList);
}

const handleexceed = function(){
    ElMessage({
        message: '文件上传数量最大值为'+props.upload.limit,
        type: 'error',
    });
}

const handleerror = function(error: Error){
    console.log(error)
    ElMessage({
        message:'上传失败,错误信息：'+error,
        type:'error'
    })
}

</script>

<template>
    <el-form-item :label="label" :prop="prop">
        <el-upload
            v-model:file-list="fileList"
            :action='upload.action'
            :multiple="upload.multiple"
            :limit="upload.limit"
            :accept="upload.accept"
            :on-success="handlesuccess"
            :on-exceed="handleexceed"
            :on-remove="handleremove"
            :on-error="handleerror"
            :name="prop"
        >
            <el-button size="small" type="primary">上传文件</el-button>
        </el-upload>
    </el-form-item>
</template>